{% extends "_layouts/examples.html" %}
{% block title %}Table / Formatting{% endblock %}

{% block standalone_css %}patterns_table{% endblock %}

{% block content %}
<table aria-label="Example of formatting in the table">
  <thead>
    <tr>
      <th>Name</th>
      <th>Status</th>
      <th class="u-align--right">Cores</th>
      <th class="u-align--right">RAM</th>
      <th class="u-align--right">Disks</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th>Example</th>
      <td>Ready</td>
      <td class="u-align--right">1</td>
      <td class="u-align--right">1 GiB</td>
      <td class="u-align--right">2</td>
    </tr>
    <tr>
      <th>Very long long long example name that should wrap</th>
      <td>Ready</td>
      <td class="u-align--right">1</td>
      <td class="u-align--right">1 GiB</td>
      <td class="u-align--right">2</td>
    </tr>
    <tr>
      <th class="u-truncate">Truncated very long long long example name</th>
      <td>Ready</td>
      <td class="u-align--right">8</td>
      <td class="u-align--right">3.9 GiB</td>
      <td class="u-align--right">3</td>
    </tr>
  </tbody>
</table>
{% endblock %}
